<template>
  <div class="fontDa">
    <div class="customTableHeader">
      <div class="customTableTitle" style="font-size: 36px;">{{ cepingHdglb.hdName }}</div>
      <div style="height: 30px;" v-if="!djxxDjmx"></div>
      <div style="text-align: center; margin:10px 0; font-size:22px;" v-if="djxxDjmx">★请对被测评对象的总体情况综合评价（优秀率不超过50%）</div>
    </div>
    <el-container>
      <el-main style="height:calc(100vh - 310px); padding: 0 45px;">
        <div v-if="isSubmit=='yes'">

        </div>
        <div v-else>
          <!--    票1-->
          <div v-if="showHzBlock.pz">
            <!--            <div class="table-head-tip-box"><span>测评票( 票1-2 )</span></div>-->
            <div v-for="(cp,xx) in cppList" :key="xx+10000" style="margin-bottom: 50px;">
              <div class="biaoTiGi">
                <span @click="open(cp,cp.cppId)">{{ cp.cppName }}</span>
              </div>
              <el-table
                :data="getXpList(cp)"
                border
                stripe
                style="width: 100%">
                <el-table-column
                  type="index"
                  label="序号"
                  header-align="center"
                  align="center"
                  width="70">
                </el-table-column>
                <el-table-column
                  label="测评对象"
                  header-align="center">
                  <template slot-scope="scope">
                    <div class="xinYang">
                      <div style="min-width:500px;width:100%">
                        <span v-if="scope.row.bcpDx=='部门'" class="deptName">
                          <i class="iconfont icon-untitled85"></i>
                          {{ scope.row.bcpDeptName }}
<!--                          领导班子-->
                        </span>
                              <span v-else>
                          <i class="el-icon-s-custom"></i>
                          {{ scope.row.bcpUserName }} {{ scope.row.userInfo ? scope.row.userInfo.ryZw : '' }}
                                <!--                      {{ scope.row.userInfo ? scope.row.userInfo.ryZjmc : '' }}-->
                        </span>
                      </div>
                      <div class="hzBox">
                        <djDf :xpId="scope.row.id" :ref="scope.row.id" :cppId='cp.cppId' :tabledata='getXpList(cp)' :djDfData='djDfData' @setList="setList"></djDf>
                      </div>
                    </div>
                  </template>
                </el-table-column>
                <el-table-column
                  prop="name"
                  label="分值"
                  header-align="center"
                  align="center"
                  width="180">
                  <template slot-scope="scope">
              <span class="red">
                {{ scope.row.cphzfz }}
              </span>
                  </template>
                </el-table-column>
                <el-table-column
                  label="操作"
                  header-align="center"
                  align="center"
                  width="180">
                  <template slot-scope="scope">
                    <el-tooltip content="点击可返回该张测评票进行测评分值修改。" placement="top" effect="light">
                      <el-button type="warning" style="margin-left:10px" @click="open(scope.row)">返回测评界面</el-button>
                    </el-tooltip>
                  </template>
                </el-table-column>
              </el-table>
            </div>
          </div>
          <!-- 票3-->
          <div v-show="showHzBlock.pz3">
            <!--          <div class="table-head-tip-box"><span>测评票( 票3 )</span></div>-->
            <cpHzPz3 ref="cpHzPz3" @openXp="openHzToXp" @closeLoading="closeLoading"></cpHzPz3>
          </div>
          <!-- 票4-->
          <div v-show="showHzBlock.pz4">
            <!--            <div class="table-head-tip-box"><span>测评票( 票4 )</span></div>-->
            <cpHzPz4 ref="cpHzPz4" @openXp="openHzToXp" @closeLoading="closeLoading"></cpHzPz4>
          </div>
          <!-- 票5-->
          <div v-show="showHzBlock.pz5">
            <!--          <div class="table-head-tip-box"><span>测评票( 票5 )</span></div>-->
            <cpHzPz5 ref="cpHzPz5" @openXp="openHzToXp" @closeLoading="closeLoading"></cpHzPz5>
          </div>
        </div>
      </el-main>
    </el-container>
    <!--    底部-->
    <div class="fontDa">
      <div class="flex justifyContentSpaceBetween font22" style="margin-left: 40px; margin-top:20px;">
        <div><!--★点击“返回测评界面”按钮，可返回该张测评票进行测评分值修改。--></div>
        <div class="flex justifyContentSpaceBetween " style="margin-right:60px;">
          <span><img src="/img/logo.png" width="40" height="40"></span><span class="ml10 font28">共享运营公司测评系统</span>
        </div>
      </div>
      <div class="buttomBtn">
        <span slot="footer" class="dialog-footer" style="position: relative;z-index: 2">
          <el-button type="primary" v-if="fromPage" @click="backFromPage()" class="nextBtn">返回</el-button>
          <el-button type="primary" v-if="type=='HD'" :disabled="!hdId" @click="tiJiao()" class="nextBtn">提交测评</el-button>
          <el-button type="primary" v-if="type=='XP'"  :disabled="!xcCode" @click="tiJiao()" class="nextBtn">提交测评</el-button>
      </span>
      </div>
    </div>
  </div>
</template>

<script>

import {wdXuanPiao, wdXuanPiaoXp, tiJiaoHd, tiJiaoXpCode} from "@/api/ceping/cepinghdglxpxxb";
import {anonymousSelhdidList as selhdidList} from '@/api/ceping/cepinghdglcppmxb'
import {getObj} from "@/api/ceping/cepinghdglb";
import {getIds as deptsGet} from "@/api/admin/dept";
import {getIds as usersGet} from "@/api/admin/user";
import {judgeTicketComplete, judgeTicketCompleteSm} from "@/api/ceping/jxevalvote";

import djDf from "./cpIndexHzDjdf";
import cpHzPz3 from "./cpIndexHzPz3";
import cpHzPz4 from "./cpIndexHzPz4";
import cpHzPz5 from "./cpIndexHzPz5";

export default {
  name: "cpIndexHz",
  components: {
    djDf,
    cpHzPz3,
    cpHzPz4,
    cpHzPz5
  },
  data() {
    return {
      show: true,
      type: "",
      hdId: null,
      xcCode: "",
      xpList: [],//所有选票
      cppList: [],
      cepingHdglb: {},
      deptObj: {},
      userObj: {},
      djxxDjmx: false,
      showHzBlock: {},
      tabsList: [],
      fromPage: '',
      fromXpId: '',
      fromcppId: '',
      isSubmit: 'no',
      list:[],
      djDfData:{},
      closeTime:0
    }
  },
  methods: {
    init() {
      this.xpList = [];
    },
    //总的汇总初始化
    initHzAll(data) {
      this.openLoading()
      this.init();
      this.type = data.type;
      this.hdId = data.hdId;
      this.xcCode = data.xpCode;
      this.tabsList = data.tabsList;
      this.fromPage = data.fromPage;
      this.fromXpId = data.xpid;
      this.fromcppId = data.cppId;
      this.getXpTab();
      //this.getHdInfo();
    },
    //初始按会议
    initHd(hdId) {
      this.init();
      this.type = "HD";
      this.hdId = hdId;
      wdXuanPiao(hdId).then(res => {
        if (res.data.data.length > 0) {
          let data = res.data.data;
          var arrData = data.filter(item => item.sheetType == '1')
          this.initJG(arrData);
        } else {
          this.$notify.closeAll();
          this.$notify.error('会议中没有选票信息')
        }
      })
    },
    //初始按选票
    initXp(xcCode) {
      this.init();
      this.type = "XP";
      this.xcCode = xcCode;
      wdXuanPiaoXp(xcCode).then(res => {
        if (res.data.data.length > 0) {
          let data = res.data.data;
          this.initJG(data);
        } else {
          this.$notify.closeAll();
          this.$notify.error('票号中没有选票信息');
        }
      })
    },
    initJG(d) {
      let data = d.sort(compareZb);

      function compareZb(a, b) {
        return b.cphzfz - a.cphzfz;
      }

      this.cppList = [];
      let cppListId = [];
      selhdidList(data[0].hdId).then(res => {
        let list = res.data.data;
        this.djxxDjmx = false;
        for (var j in list) {
          if (!(list[j].djxxDjmx == "" || list[j].djxxDjmx == null)) {
            this.djxxDjmx = true;
          }
          if (cppListId.indexOf(list[j].cppId) == -1) {
            for (let i in data) {
              if (data[i].cppId == list[j].cppId) {
                this.cppList.push(list[j])
                cppListId.push(list[j].cppId)
                break;
              }
            }
          }
        }
        for (let i in data) {
          if (data[i].bcpDx == "部门") {
            this.xpList.push(data[i])
          }
        }
        for (let j in data) {
          if (data[j].bcpDx == "个人") {
            this.xpList.push(data[j])
          }
        }
        this.getHdInfo();
        this.getDeptUser();
      })
    },
    getXpList(cp) {
      let list = [];
      for (var i in this.xpList) {
        if (this.xpList[i].cppId == cp.cppId) {
          list.push(this.xpList[i])
        }
      }
     this.closeLoading();
      return list;
    },
    getHdInfo() {
      if (this.xpList.length > 0) {
        getObj(this.xpList[0].hdId).then(res => {
          this.cepingHdglb = res.data.data;
        })
      }
    },
    getDeptUser() {
      let deptIds = [];
      let userIds = [];
      for (var i in this.xpList) {
        let r = this.xpList[i];
        if (r.bcpDx == "部门") {
          deptIds.push(r.bcpDeptId)
        }
        if (r.bcpDx == "个人") {
          userIds.push(r.bcpUserId)
        }
      }
      if (deptIds.length > 0) {
        deptsGet(deptIds.join()).then(res => {
          for (var i in res.data.data) {
            this.deptObj[res.data.data[i].deptId] = res.data.data[i];
            for (var j in this.xpList) {
              let r = this.xpList[j];
              if (r.bcpDx == "部门") {
                if (res.data.data[i].deptId == r.bcpDeptId) {
                  this.$set(r, "deptInfo", res.data.data[i]);
                }
              }
            }
          }
        })
      }
      if (userIds.length > 0) {
        usersGet(userIds.join()).then(res => {
          for (var i in res.data.data) {
            this.userObj[res.data.data[i].userId] = res.data.data[i];
            for (var j in this.xpList) {
              let r = this.xpList[j];
              if (r.bcpDx == "个人") {
                if (res.data.data[i].userId == r.bcpUserId) {
                  this.$set(r, "userInfo", res.data.data[i]);
                }
              }
            }
          }

        })
      }
    },
    open(t,cppId) {
      console.log(t)
      console.log("cppId:"+cppId)
      //我应该记住上一个页面的数据
      var params = {
        id: t.id,
        clickTab: 'ceping',
        cppId:cppId,
        upPageObj: {
          toPage: this.fromPage,
          tpXpId: this.fromXpId,
          cppId: this.fromcppId
        }
      }
      this.$emit('openXp', params);
    },
    //获取选票步骤
    getXpTab() {
      this.tabsList.forEach(item => {
        switch (item.name) {
          case 'ceping':
            this.showHzBlock['pz'] = true;
            if (this.type == 'HD') {
              this.initHd(this.hdId)
            } else {
              this.initXp(this.xcCode)
            }
            break;
          case 'ceping3':
            this.showHzBlock['pz3'] = true;
            this.fnGetHzInit('cpHzPz3');
            break;
          case 'ceping4':
            this.showHzBlock['pz4'] = true;
            this.fnGetHzInit('cpHzPz4');
            break;
          case 'ceping5':
            this.showHzBlock['pz5'] = true;
            this.fnGetHzInit('cpHzPz5');
            break;
        }
        this.$forceUpdate()
      })
    },
    //加载各个汇总页的方法
    fnGetHzInit(refs) {
      this.$nextTick(() => {
        var param = {
          xpCode: this.xcCode,
          hdId: this.hdId,
          type: this.type,
          fromPage: this.fromPage,
          fromXpId: this.fromXpId,
          fromcppId: this.fromcppId
        }
        if (this.type == 'HD') {
          this.$refs[refs].InitHdHz(param)
        } else {
          this.$refs[refs].initHz(param)
        }
        this.closeLoading()
      })
    },
    //从汇总页打开测评页
    openHzToXp(data) {
      this.$emit('openXp', data)
    },
    //返回到上一个界面
    backFromPage() {
      var data = {
        toPage: this.fromPage,
        tpXpId: this.fromXpId,
        cppId: this.fromcppId
      }
      this.$emit('backFromPage', data)
    },
    //提交测评
    tiJiao() {
      if (this.type == 'HD') {
        var params = {
          hdId: this.hdId,
          userId: this.$store.state.user.userInfo.userId
        }
        judgeTicketCompleteSm(params).then(res => {
          if (res.data.code == 0) {
            var arr = res.data.data;
            this.verficateData(arr)
          }
        })
      } else {
        var params = {
          hdId: this.hdId,
          xpCode: this.xcCode
        }
        judgeTicketComplete(params).then(res => {
          if (res.data.code == 0) {
            var arr = res.data.data;
            this.verficateData(arr)
          }
        })
      }
    },
    //验证数据是否已经全部完成
    verficateData(arr) {
      if (arr[0].code == 0) {
        this.confirmSubmitInfo();
      } else {
        var noPickArr = arr.filter(item => item.code == 1);
        var qiPiaokArr = arr.filter(item => item.sheetType == 4 && item.qp == 1);
        if (noPickArr.length != qiPiaokArr.length) {
          this.$confirm('您的测评还没有完成，请继续完成测评。', "提示", {
            confirmButtonText: '执行提交操作',
            showConfirmButton: false,
            cancelButtonText: '继续测评',
            type: 'warning'
          }).then(_ => {
            this.confirmSubmitInfo();
          }).catch(_ => {
          });
          // this.$message.warning( '您还有未测评的指标项，请继续完成测评!');
          return false;
        } else {
          //var text=qiPiaokArr.find(item)
          var tipText = qiPiaokArr.length > 1 ? '等' : '';
          this.$confirm('您对【' + qiPiaokArr[0].cppName + '】' + tipText + qiPiaokArr.length + '张票选择弃票处理！确定要提交测评吗？', '提示', {
            confirmButtonText: '确认提交测评',
            cancelButtonText: '继续测评',
            type: 'warning'
          }).then(() => {
            this.confirmSubmitInfo();
          })
        }
      }
    },
    //保存提交的数据
    confirmSubmitInfo() {
      var param = {
        hdId: this.hdId,
        xpCode: this.xcCode
      }
      this.$emit('tiJiao', param)
      this.$confirm('正式提交后将不可修改，是否确认提交测评？', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        if (this.type == "HD") {
          tiJiaoHd(this.hdId).then(res => {
            if (res.data.code == "0") {
              this.$notify.success("此次测评会议已提交成功");
              this.$emit('tiJiaoDone')
            } else {
              this.$notify.closeAll();
              this.$notify.error(res.data.msg)
            }
          })
        } else {
          tiJiaoXpCode(this.hdId, this.xcCode).then(res => {
            if (res.data.code == "0") {
              this.$notify.success("此次测评会议已提交成功");
              this.$emit('tiJiaoDone')
            } else {
              this.$notify.closeAll();
              this.$notify.error(res.data.msg)
            }
          })
        }
      })
    },
    setList(params){
      var arr,len,num,index;
     if(params.type=='初始'){
       this.list.push(params.obj)
     }else{
       index =this.list.findIndex(item=>item.xpId==params.obj.xpId&&params.obj.cppId==item.cppId);

        arr=this.list.filter(item=>item.dcName==params.obj.dcName&&params.obj.cppId==item.cppId);
        len=params.tabledata;
        num=arr.length*1+1
        if(index==-1){
        // debugger;
        if(len.length==1){
          this.$nextTick(()=>{
            this.$refs[params.obj.xpId][0].goOn();
          this.list.push(params.obj)
          })
        }else{
            if((num/len.length*1)*100>params.obj.dcZb&&params.obj.dcZb){
              this.$message.closeAll();
              this.$message.warning(params.obj.dcName+'选项不允许超过设定的占比:'+params.obj.dcZb+'%')
              this.djDfData={
                  goOn:false
                }
            }else{
              this.$nextTick(()=>{
                this.$refs[params.obj.xpId][0].goOn();
              this.list.push(params.obj)
              })
            }
        }

      }else{
       // debugger;
       if(len.length==1){
         this.list[index]=params.obj;
          this.$nextTick(()=>{
            this.$refs[params.obj.xpId][0].goOn();
          })
       }else{
         if((num/len.length*1)*100>params.obj.dcZb&&params.obj.dcZb){
            this.$message.closeAll();
            this.$message.warning(params.obj.dcName+'选项不允许超过设定的占比:'+params.obj.dcZb+'%')
            this.djDfData={
                goOn:false
              }
          }else{
            this.list[index]=params.obj;
            this.$nextTick(()=>{
              this.$refs[params.obj.xpId][0].goOn();
            })
          }
       }

      }
     }
    },
    //提交loading
    openLoading(textType) {
      var textType=textType?textType:'加载'
      const loading = this.$loading({
        lock: true,
        text: "正在"+textType+"，请稍等...",
        spinner: "el-icon-loading",
        background: "rgba(255, 255, 255, 0.9)",
      });
    },
    //关闭loading
    closeLoading(){
      if(this.closeTime==0){
        console.log('关闭loading')
        this.$loading().close();
        this.closeTime=1;
      }
    }
  }
}
</script>

<style scoped>
/deep/ .el-table .hzBox {
  border: 0px !important;
  margin: 0;
  padding: 10px 0;
}

.xinYang {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.biaoTiGi {
  width: 100%;
  height: 60px;
  line-height: 60px;
  text-align: center;
  font-size: 28px;
  font-weight: bolder;
  /*background: #1f84ec;*/
  background: #b0bde2;
  /*color: #fff;*/
}

.biaoTiGi span:hover {
  color: #1a71fb;
  cursor: pointer;
}

.table-head-tip-box {
  border-top: solid 1px #6495ed;
  padding: 10px 0;
  font-weight: 600;
}
</style>
